import 'package:flutter/material.dart';

/// 添加侧滑栏
/// 步骤：
/// 1. 创建一个Scaffold
/// 2. 添加侧滑页
/// 3. 绘制条目
/// 4. 关闭侧滑

class DrawerApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final appTitle = 'Drawer Demo';
    return MaterialApp(
      title: appTitle,
      theme: ThemeData(primarySwatch: Colors.red),
      home: DrawerAppPage(title: appTitle),
    );
  }
}

class DrawerAppPage extends StatefulWidget {
  final String title;

  DrawerAppPage({Key key, this.title}) : super(key: key);

  @override
  State<StatefulWidget> createState() => DrawerAppPageState();
}

class DrawerAppPageState extends State<DrawerAppPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      // 侧滑页
      drawer: Drawer(
        // 列表
        child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            // 侧滑栏头部
            DrawerHeader(
              child: Text('Drawer Header'),
              // 装饰
              decoration: BoxDecoration(color: Colors.blue),
            ),
            ListTile(
              title: Text('Item 1'),
              onTap: () {
                print('Item 1');
              },
            ),
            ListTile(
              title: Text('Item 2'),
              onTap: () {
                print('Item 2');
              },
            ),
            ListTile(
              title: Text('关闭'),
              onTap: () {
                print('关闭');
                Navigator.pop(context);
              },
            )
          ],
        ),
      ),
    );
  }
}
